<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@taglib prefix = "s" uri = "/struts-tags" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="zh-CN">
	<head>
		<meta charset="utf-8">
	    <meta http-equiv="X-UA-Compatible" content="IE=edge">
	    <meta name="viewport" content="width=device-width, initial-scale=1">  
	    <title>轻松课堂后台登录</title>
        <meta name="description" content="">
        <meta name="author" content="macc">

	    <link href="./css/font-awesome.min.css" rel="stylesheet">
	    <link href="./css/bootstrap.min.css" rel="stylesheet">
	    <link href="./css/templatemo-style.css" rel="stylesheet">
	    
	    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
	    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
	    <!--[if lt IE 9]>
	      <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
	      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
	    <![endif]-->
	</head>
	
	<body class="light-gray-bg">
		<input type = "hidden" id = "result" value = "${sessionScope.loginresult}">
		<div class="templatemo-content-widget templatemo-login-widget white-bg">
			<header class="text-center">
	          <div class="square"></div>
	          <h1>轻松课堂后台</h1>
	        </header>
	        <s:form action="LoginManage_login" namespace='/login' method="post" class="templatemo-login-form">
	        	<div class="form-group">
	        		<div class="input-group">
		        		<div class="input-group-addon"><i class="fa fa-user fa-fw"></i></div>	        		
		              	<input id="tusername" name="tusername" type="text" class="form-control" placeholder="请输入账号">           
		          	</div>	
	        	</div>
	        	<div class="form-group">
	        		<div class="input-group">
		        		<div class="input-group-addon"><i class="fa fa-key fa-fw"></i></div>	        		
		              	<input id = "tpassword" name="tpassword" type="password" class="form-control" placeholder="请输入密码">           
		          	</div>	
	        	</div>	          	
				<%-- <div align="center" class="row form-group">
               		<div class="form-group">                   
	                    <div class="margin-right-50 templatemo-inline-block">
	                      <input type="radio" name="select" id="admin" value="admin" checked>
	                      <label for="admin" class="font-weight-400"><span></span>管理员</label>
	                    </div> 
	                    <div class="templatemo-inline-block">
	                      <input type="radio" name="select" id="operator" value="operator" checked>
	                      <label for="operator" class="font-weight-400"><span></span>教师用户</label>
	                    </div>
                	</div>
              	</div> --%>
              	<div class="form-group">
					<button type="submit" class="templatemo-blue-button width-100" onClick = "return check();">登录</button>
				</div>
	        </s:form>
		</div>
		
	<!-- JS -->
    <script type="text/javascript" src="./js/jquery-1.11.2.min.js"></script>      <!-- jQuery -->
    <script type="text/javascript" src="./js/bootstrap.min.js"></script>
	<!-- 模态框（Modal） -->
	<div class="modal fade" id="wrongnameModal" tabindex="-1" role="dialog" 
	   aria-labelledby="wrongtitle" aria-hidden="true">
	   <div class="modal-dialog">
	      <div class="modal-content">
	         <div class="modal-header">
	            <h4 class="modal-title" id="wrongtitle">
	             	账号不存在，请重试
	            </h4>
	         </div>
	      </div><!-- /.modal-content -->
		</div><!-- /.modal -->
	</div>
	<div class="modal fade" id="wrongpwdModal" tabindex="-1" role="dialog" 
	   aria-labelledby="wrongtitle" aria-hidden="true">
	   <div class="modal-dialog">
	      <div class="modal-content">
	         <div class="modal-header">
	            <h4 class="modal-title" id="wrongtitle">
	             	密码错误，请重试
	            </h4>
	         </div>
	      </div><!-- /.modal-content -->
		</div><!-- /.modal -->
	</div>
		<div class="modal fade" id="emptyModal" tabindex="-1" role="dialog" 
	   aria-labelledby="wrongtitle" aria-hidden="true">
	   <div class="modal-dialog">
	      <div class="modal-content">
	         <div class="modal-header">
	            <h4 class="modal-title" id="wrongtitle">
	             	请输入账号和密码
	            </h4>
	         </div>
	      </div><!-- /.modal-content -->
		</div><!-- /.modal -->
	</div>
    <script>
	    $(function()
	   	{
	   	 	var result = document.getElementById("result").value
	   	 	if(result == "wrongname")
 	 		{
	   	 		$('#wrongnameModal').modal("show");
	   	 		setTimeout(function(){$("#wrongnameModal").modal("hide")},1000);
 	 		}
		   	 if(result == "wrongpwd")
	 		{
	 			$('#wrongpwdModal').modal("show");
	 			setTimeout(function(){$("#wrongpwdModal").modal("hide")},1000);
	 		}
	   	});
	    
	    function check(){
			  var username = document.getElementById("tusername").value;
			  var password = document.getElementById("tpassword").value;

		      if (username == "" || password == ""){  
		    	  $('#emptyModal').modal("show");
		 			setTimeout(function(){$("#emptyModal").modal("hide")},1000);
		           return false;  
		      }  
		}
    </script>
	</body>
</html>